body{background-color:#ECEDF1;display:flex;
    flex-direction:column;}

#chat-content{position:absolute;left:0;right:0;bottom:2.7rem;top:0.8rem;overflow-y:scroll;overflow-x: hidden;}

.sender{padding:0.2rem;position: relative;margin-top:0.4rem;}
.sender .avater{width:0.8rem;height:0.8rem;float: left;margin-left:-8rem;}
.sender .avater img{width:100%;height:100%;display:block;border-radius:0.1rem;}
.sender .content{float: left;width:8rem;} 
.sender .content .date{line-height:0.6rem;font-size:0.3rem;position:absolute;top: -0.3rem;left: 0.3rem;color:#AAAAAA;}
.sender .content .msg{line-height:0.8rem;font-size:0.3rem;border-radius:0.2rem;background-color:#54B4EF;padding:0.2rem;color:#FFFFFF;margin-left:1rem;margin-right:0.4rem;word-break:break-all;float: left;}
.sender .content .msg img{display:block;border-radius:0.2rem;}
.sender .content .msg .product{position: relative;background-color:#FFFFFF;margin:0;display:block;}
.sender .content .msg .product .img{width:1rem;height:1rem;float:left;margin:0.2rem 0 0 0.2rem;border:1px solid #DDDDDD;}
.sender .content .msg .product .desc{float: left;width:4.1rem;padding-left:0.2rem;position: relative;}
.sender .content .msg .product .desc .title{height:0.6rem;margin-top:0.2rem;line-height:0.5rem;color:#333333;}
.sender .content .msg .product .desc .price{height:0.6rem;color:#FF5300;line-height:0.5rem;}
.sender .content .msg .product .desc .pai{width: 0.46rem;height: 0.49rem;background: url(/img/order/order-pai.png);background-size: 0.46rem 0.49rem;position:absolute;bottom:0.2rem;right:0.2rem;}

.accepter{padding:0.6rem 0.2rem 0.2rem 0.2rem;position: relative;}
.accepter .avater{width:0.8rem;height:0.8rem;float:right;margin-right:-8rem;}
.accepter .avater img{width:100%;height:100%;display:block;}
.accepter .content{float:right;width:8rem;} 
.accepter .content .date{line-height:0.6rem;font-size:0.3rem;position:absolute;top:0;right: 0.3rem;color:#AAAAAA;}
.accepter .content .msg{line-height:0.8rem;font-size:0.3rem;border-radius:0.2rem;background-color:#54B4EF;padding:0.2rem;color:#FFFFFF;margin-right:1rem;margin-left:0.4rem;word-break:break-all;float:right;}
.accepter .content .msg img{display:block;border-radius:0.2rem;}
.accepter .content .msg .product{position: relative;background-color:#FFFFFF;margin:0;display:block;}
.accepter .content .msg .product .img{width:1rem;height:1rem;float:left;margin:0.2rem 0 0 0.2rem;border:1px solid #DDDDDD;}
.accepter .content .msg .product .desc{float: left;width:4.1rem;padding-left:0.2rem;position: relative;}
.accepter .content .msg .product .desc .title{height:0.6rem;margin-top:0.2rem;line-height:0.5rem;color:#333333;}
.accepter .content .msg .product .desc .price{height:0.6rem;color:#FF5300;line-height:0.5rem;}
.accepter .content .msg .product .desc .pai{width: 0.46rem;height: 0.49rem;background: url(/img/order/order-pai.png);background-size: 0.46rem 0.49rem;position:absolute;bottom:0.2rem;right:0.2rem;}

.chat-form{position:fixed;width:8rem;bottom:0;background-color:#FFFFFF;height:2.7rem;}
.chat-form .send{height:0.9rem;border-bottom:1px solid #DDDDDD;}
.chat-form .send input{width:5.7rem;border:0 none;height:0.76rem;margin-left:0.2rem;border-bottom:1px solid #DDDDDD;display:block;float: left;word-break:break-all;overflow-y:auto;word-break: break-word; /* 文本行的任意字内断开 */
    word-wrap: break-word; /* IE */    font-size: 0.3rem;
    white-space: -moz-pre-wrap; /* Mozilla */    
    white-space: -hp-pre-wrap; /* HP printers */    
    white-space: -o-pre-wrap; /* Opera 7 */    
    white-space: -pre-wrap; /* Opera 4-6 */    
    white-space: pre; /* CSS2 */    
    white-space: pre-wrap; /* CSS 2.1 */    
    white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */}
.chat-form .send i{width:0.6rem;height:0.6rem;float: left;display:block;margin-left:0.2rem;font-size:0.4rem;margin-top:0.1rem;}
svg{width:0.6rem;height:0.6rem;float: left;display:block;margin-left:0.2rem;font-size:0.4rem;margin-top:0.1rem;}
.chat-form .type-list{height:1.8rem;}
.chat-form .type-list .item{width:0.85rem;height:1.4rem;float: left;margin-left:0.3rem;margin-top:0.25rem;display:block;position: relative;}
.chat-form .type-list .item .icon{width:0.85rem;height:0.85rem;border:1px solid #DDDDDD;border-radius:0.2rem;}
.chat-form .type-list .item .title{height:0.55rem;line-height:0.55rem;font-size:0.3rem;text-align:center;}

.weui-uploader__input{display:block;}

#chat-list{min-height:100%;bottom:0;}

.face-list{position:absolute;left:0;right:0;bottom:0;height:2.1rem;background-color:#FFFFFF;display:none;}
.face-list li{float:left;width:0.665rem;height:0.665rem;list-style:none;}
.face-list li img{display:block;width:0.665rem;height:0.665rem;}

.product{position: relative;background-color:#FFFFFF;margin:0.2rem;display:block;}
.product .img{width:1rem;height:1rem;float:left;margin:0.2rem 0 0 0.2rem;border:1px solid #DDDDDD;}
.product .desc{float: left;width:6.1rem;padding-left:0.2rem;position: relative;}
.product .desc .title{height:0.6rem;margin-top:0.2rem;line-height:0.5rem;}
.product .desc .price{height:0.6rem;color:#FF5300;line-height:0.5rem;}
.product .desc .pai{width: 0.46rem;height: 0.49rem;background: url(/img/order/order-pai.png);background-size: 0.46rem 0.49rem;position:absolute;bottom:0.2rem;right:0.2rem;}